<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Shop Center</title>
	<link rel="stylesheet" href="https://cdn.bugbank.xyz/dance/css/dance.min.css">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<style>
		body{
			background-color: #f1f1f1;
			padding: 2rem 0.8rem;

		}
		.shop{
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			align-items: center;
			width: 90vw;
			/* height: 100vh; */
			margin: 0px auto;
		}
		.box{
			overflow: hidden;
			width: 256px;
			height: auto;
			margin: 1rem;
			text-align: center;
			background-color: #fff;
			border-radius: 10px;

		}
		.box img{
			border-radius: 10px 10px 0px 0px;
			width: 256px;
			height: 256px;
		}
	</style>
</head>
<body>
	<div class="shop">
		<div class="box shadow-a">
			<img  class="heart-hover" src="https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3278093656,2506998021&fm=11&gp=0.jpg" alt="img">
			<h3 class="text-a">名称</h3>
			<p>描述</p>
			<p class="text-c-hover"><mark>价格</mark></p>
			<p><em>编号</em></p>
		</div>
		<div class="box shadow-a">
			<img class="heart-hover"  src="https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2184409723,2042599489&fm=11&gp=0.jpg" alt="img">
			<h3 class="text-a">名称</h3>
			<p>描述</p>
			<p class="text-c-hover"><mark>价格</mark></p>
			<p><em>编号</em></p>
		</div>
		<div class="box shadow-a">
			<img class="heart-hover" src="https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=2328622225,2844636259&fm=26&gp=0.jpg" alt="img">
			<h3 class="text-a">名称</h3>
			<p>描述</p>
			<p class="text-c-hover"><mark>价格</mark></p>
			<p><em>编号</em></p>
		</div>
		<div class="box shadow-a">
			<img class="heart-hover"  src="https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=2057588226,2402156864&fm=11&gp=0.jpg" alt="img">
			<h3 class="text-a">名称</h3>
			<p>描述</p>
			<p class="text-c-hover"><mark>价格</mark></p>
			<p><em>编号</em></p>
		</div>
		<div class="box shadow-a">
			<img class="heart-hover" src="https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=2559364190,3450775087&fm=26&gp=0.jpg" alt="img">
			<h3 class="text-a">名称</h3>
			<p>描述</p>
			<p class="text-c-hover"><mark>价格</mark></p>
			<p><em>编号</em></p>
		</div>
	</div>
</body>
</html>